<!--  -->
<template>
  <div>
    <el-upload
      class="upload-demo"
      :action="action"
      :accept="accept"
      :before-remove="beforeRemove"
      :on-remove="onRemove"
      multiple
      :limit="limit"
      :on-exceed="handleExceed"
      :on-success="onSuccessUpload"
    >
      <el-button size="small" type="primary">点击上传</el-button>
      <div slot="tip" class="el-upload__tip">
        {{ tips }}
      </div>
    </el-upload>
  </div>
</template>

<script>
export default {
  name: "fileUpload",
  components: {},
  props: {
    // 限制上传图片的文件大小(kb)
    size: {
      type: Number,
      default: 1024 * 5,
    },
    action: {
      type: String,
      default: "/api/FileUpload/DebtAudit",
    },
    limit: {
      type: Number,
      default: 1,
    },
    tips: {
      type: String,
      default: "只能上传rar / zip文件，且不超过8M",
    },
    accept: {
      type: String,
      default: ".zip,.rar",
    },
  },
  data() {
    return {
      // limit: 1,
    };
  },
  computed: {},
  watch: {},
  methods: {
    handleExceed(files, fileList) {
      this.$message.warning(
        `当前限制选择${this.limit}个文件，本次选择了 ${
          files.length
        } 个文件，共选择了 ${files.length + fileList.length} 个文件`
      );
    },
    beforeRemove(file) {
      return this.$confirm(`确定移除 ${file.name}？`);
    },
    onRemove() {
      this.$emit("onSuccessUpload", "");
    },
    onSuccessUpload(res) {
      if (res.data.length > 0) {
        this.$emit("onSuccessUpload", res.data);
      } else {
        this.$message({ type: "error", message: "上传错误" });
      }
    },
  },
  created() {},
  mounted() {},
  beforeCreate() {},
  beforeMount() {},
  beforeUpdate() {},
  updated() {},
  beforeDestroy() {},
  destroyed() {},
  activated() {},
};
</script>
<style lang='scss' scoped>
//@import url(); 引入公共css类
</style>